import React from 'react'
import PropTypes from 'prop-types'
import { View, Text, StyleSheet } from 'react-native'
import { ScaleS, ScaleT, WIDTH, ONE_PIXEL } from 'src/utils/ScreenUtil'
import { getSettlementMethod, unitList, getUserAvatorLocalB } from 'src/utils/ConfigUtil'
import JobType from 'src/components/job-type'
import DefaultImage from 'src/components/image/DefaultImage'
import CustomImage from '../../../../components/image/CustomImage'
import CustomButton from 'src/components/button/CustomButton'

export default class JobBossInfo extends React.PureComponent {
  constructor(props) {
    super(props)
    this.basicInfo = props.data
  }

  static propTypes = {
    data: PropTypes.object,
    collectionCount: PropTypes.number,
    chatClick: PropTypes.func,
    collectionId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
    onCollected: PropTypes.func,
    isLivePost: PropTypes.bool,
    isSendResume: PropTypes.bool
  }

  render() {
    const { data, collectionCount, collectionId, isLivePost, isSendResume } = this.props
    console.log(data, collectionCount, 'JobBasicInfo')
    return (
      <View style={styles.cell}>
        <View style={styles.topView}>
          <View>
            <Text style={styles.userName}>{data.userName}</Text>
            <Text style={styles.position}>{data.position}</Text>
          </View>
          <DefaultImage
            style={styles.defaultImg} source={{ uri: data.avator }}
            errorSource={getUserAvatorLocalB()} />
        </View>
        <View style={styles.topBottom}>
          <View style={styles.topBottomView}>
            <View style={styles.topBottomView1}>
              <Text style={styles.topBottomViewSize}>{data.collectionArchiveCount || 0}</Text>
              <Text style={styles.topBottomViewText}>关注</Text>
            </View>
            <View style={styles.topBottomView2}>
              <Text style={styles.topBottomViewSize}>{collectionCount || 0}</Text>
              <Text style={styles.topBottomViewText}>被关注</Text>
            </View>
          </View>
          <View style={styles.topBottomView}>
            <CustomButton onPress={this.props.onCollected} params={collectionId} style={styles.topBottomView3}>
              {/* require('@/imgC/userinfo/add_black.png) */}
              <CustomImage style={styles.customImage} source={collectionId ? require('@/imgC/post/attention.png') : require('@/imgC/post/abolishAttention.png')} />
            </CustomButton>
            <CustomButton onPress={this.props.chatClick} params={isLivePost ? 2 : 1} style={styles.topBottomView4}>
              <Text style={styles.topBottomView4Text}>
                {(isSendResume && isLivePost) ? '已投递' : isLivePost ? '投递简历' : '沟通'}
              </Text>
            </CustomButton>
          </View>
        </View>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  topView: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'flex-start',
    paddingHorizontal: ScaleS(20),
    marginTop: ScaleS(0)
  },
  userName: {
    color: '#3C3C3C',
    fontSize: ScaleT(22),
    fontWeight: '900',
    marginTop: ScaleS(15)
  },
  position: {
    fontSize: ScaleS(14),
    fontWeight: '400',
    color: '#3C3C3C',
    marginTop: ScaleS(15)
  },
  defaultImg: {
    width: ScaleS(90),
    height: ScaleS(90),
    borderRadius: ScaleS(45)
  },
  topBottom: {
    flexDirection: 'row',
    marginHorizontal: ScaleS(20),
    justifyContent: 'space-between',
    paddingTop: ScaleS(44),
    paddingBottom: ScaleS(19),
    alignItems: 'flex-end',
    borderBottomWidth: ONE_PIXEL,
    borderColor: 'rgba(151, 151, 151, 0.2)'
  },
  topBottomView: {
    flexDirection: 'row'
  },
  topBottomView1: {
    justifyContent: 'center',
    alignItems: 'center',
    marginRight: ScaleS(43)
  },
  topBottomView2: {
    justifyContent: 'center',
    alignItems: 'center'
  },
  topBottomView4: {
    width: ScaleS(70),
    height: ScaleS(30),
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#FFE400',
    borderRadius: ScaleS(4)
  },
  topBottomView3: {
    width: ScaleS(50),
    height: ScaleS(30),
    backgroundColor: '#000',
    justifyContent: 'center',
    alignItems: 'center',
    marginRight: ScaleS(10),
    borderRadius: ScaleS(4)
  },
  topBottomViewText: {
    fontSize: ScaleT(11),
    color: '#9E9E9E',
    marginTop: ScaleS(5)
  },
  topBottomViewSize: {
    fontSize: ScaleT(20),
    fontWeight: 'bold',
    color: '#3C3C3C'
  },
  customImage: {
    width: '100%',
    height: '100%'
  },
  topBottomView4Text: {
    fontSize: ScaleS(12)
  }
})
